<%@page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta name="format-detection" content="telephone=no">
    <title>活动详情</title>
    <link rel="stylesheet" href="../app/css/html5.css">
    <script src="../app/js/zepto.min.js"></script>
    <script src="../app/js/html5.js"></script>
</head>

<body ontouchstart>
<style>
    body{background: #f5f5f5;}
    .ui-placehold-img {padding-top: 46.11%;position: relative;}
    .hdhead{height: 90px;border-bottom: 1px #eaeaea solid;background: #ffffff}
    .hdhead h2{font-size:14px;padding-top: 10px;margin-left: 18px;font-weight: bold}
    .hdhead p{font-size:12px;color:#7d7d7d;margin-left: 19px;padding-left:21px;background-size: 12px;background-position: 2px 3px;}
    .icon01{background: url('../app/img/icon01.png') no-repeat;}
    .icon02{background: url('../app/img/icon02.png') no-repeat;}
    .icon03{background: url('../app/img/icon03.png') no-repeat;}
    .hdcontent{border-bottom: 1px #eaeaea solid;border-top: 1px #eaeaea solid;background: #ffffff;margin-top: 5px;font-size:13px;-webkit-box-sizing: border-box;box-sizing: border-box;}
    .hdcontent h2{font-size:14px;padding-top: 10px;margin-left: 15px;}
    .hdcontent p{font-size: 13px;padding:0 18px;}
    .hdcontent p img{width: 100%;height:100%;margin:6px 0px;}

</style>

<section class="ui-container">
    <section class="ui-placehold-img">
        <span style="background-image:url(${bean.url});background-size: 100%"></span>
    </section>
    <section id="list">
        <div class="hdhead">
            <h2>${bean.title}</h2>
            <p class="icon01">
                <fmt:formatDate value="${bean.beginTime }" pattern="yyyy-MM-dd HH:mm:ss"/>
                --
                <fmt:formatDate value="${bean.endTime }" pattern="yyyy-MM-dd HH:mm:ss"/>
            </p>
            <p class="icon02 ui-nowrap ui-whitespace">${bean.address}</p>
            <p class="icon03">剩余名额  ${bean.leftCount}</p>
        </div>
        <div class="hdcontent">
            <p>
                ${bean.content}
            </p>
        </div>
    </section>
</section>

</body>
</html>